<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动定位</title>
		<!-- 浮动属性 float：left，right none -->
		<style>
		div{
			width: 300px;
			height: 300px;
			border-radius: 50%;
			/* 浮动 */
			float:right;
			font-size: 10em;
			text-align: center;
			line-height: 300px;
		}	
		#d1{
			background-color: #fff000;
		}
		#d2{
			background-color: aqua;
		}
		#d3{
			background-color: aquamarine;
			clear:right;
		}
		#d4{
			background-color: blueviolet;
			clear:right;
		}
		</style>
	</head>
	<body>
		<div id="d1">1</div>
		<div id="d2">2</div>
		<div id="d3">3</div>
		<div id="d4">4</div>
	</body>
</html>